<template>
    <view class="info-c">
        <view>
            <view class="item-title">基础信息</view>
            <view class="item-content">
                <view class="item-content-row">
                    <view>客户名称</view>
                    <view>{{ info.customerName }}</view>
                </view>
                <view class="item-content-row">
                    <view>客户类型</view>
                    <view>{{ bus_client_type[info.customerType] }}</view>
                </view>
                <view class="item-content-row">
                    <view>客户星级</view>
                    <view class="rate-box"><u-rate v-model="info.customerStarLevel" readonly></u-rate></view>
                    <!-- <view>{{ info.customerStarLevel }}</view> -->
                </view>
                <view class="item-content-row">
                    <view>客户状态</view>
                    <view>{{ bus_customer_status[info.customerStatus] }}</view>
                </view>
                <view class="item-content-row">
                    <view>客户来源</view>
                    <view>{{ bus_source[info.opportunitySource] }}</view>
                </view>
                <view class="item-content-row">
                    <view>客户归属</view>
                    <view>{{ info.businessManagerName }}</view>
                </view>
            </view>
        </view>
        <view>
            <view class="item-title">更多信息</view>
            <view class="item-content">
                <view class="item-content-row">
                    <view>所在地区</view>
                    <view>
                        {{ info.localProvinceName + info.localCityName + info.localCountyName  }}<text v-if="info.localAreaName">{{ info.localAreaName }}</text>
                    </view>
                </view>
                <view class="item-content-row">
                    <view>详情地址</view>
                    <view>{{ info.detailedAddress }}</view>
                </view>
                <view class="item-content-row">
                    <view>备注信息</view>
                    <view>{{ info.remark }}</view>
                </view>
            </view>
        </view>
        <view>
            <view class="item-title">财务信息</view>
            <view class="item-content">
                <view class="item-content-row">
                    <view>已成交金额</view>
                    <view>{{ info.dealMoney || 0 }}</view>
                </view>
                <view class="item-content-row">
                    <view>已回款金额</view>
                    <view>{{ info.recycleMoney || 0 }}</view>
                </view>
            </view>
        </view>
        <view>
            <view class="item-title">系统信息</view>
            <view class="item-content">
                <view class="item-content-row">
                    <view>系统编号</view>
                    <view>{{ info.customerCode || '---' }}</view>
                </view>
                <view class="item-content-row">
                    <view>创建人员</view>
                    <view>{{ info.createByName }}</view>
                </view>
                <view class="item-content-row">
                    <view>所属部门</view>
                    <view>{{ info.deptName }}</view>
                </view>
                <view class="item-content-row">
                    <view>前归属人</view>
                    <view>{{ info.frontBusinessManagerName || '---' }}</view>
                </view>
                <view class="item-content-row">
                    <view>前所属部门</view>
                    <view>{{ info.frontDeptName || '---' }}</view>
                </view>
                <view class="item-content-row">
                    <view>创建时间</view>
                    <view>{{ info.createTime }}</view>
                </view>
                <view class="item-content-row">
                    <view>更新时间</view>
                    <view>{{ info.updateTime || '---' }}</view>
                </view>
                <view class="item-content-row">
                    <view>最后跟进</view>
                    <view>{{ info.latestFollowupTime || '---' }}</view>
                </view>
                <view class="item-content-row">
                    <view>下次跟进</view>
                    <view>{{ info.nextFollowUpTime || '---' }}</view>
                </view>

            </view>
        </view>
    </view>
</template>

<script>
import { convertToDict } from '@/common/utils'
export default {
    props: {
        info: {
            type: Object,
            default() {
                return {}
            }
        }
    },
    data() {
        return {
            bus_client_type: {},
            bus_customer_status: {},
            bus_source: {}
        }
    },
    mounted() {
        // 客户类型
        this.bus_client_type = convertToDict(JSON.parse(uni.getStorageSync('bus_client_type')));
        // 客户状态
        this.bus_customer_status = convertToDict(JSON.parse(uni.getStorageSync('bus_customer_status')));
        // 客户来源
        this.bus_source = convertToDict(JSON.parse(uni.getStorageSync('bus_source')));
    },
    methods: {
        getData() {
            // console.log('客户信息获取数据')
        },
    }
}
</script>

<style lang="scss" scoped>
.item-title {
    padding: 48rpx 32rpx 20rpx 32rpx;
    font-size: 32rpx;
    font-weight: 500;
    color: rgba(12, 16, 25, 1);
}

.item-content {
    background: rgba(255, 255, 255, 1);
    padding: 0 32rpx;
    border-radius: 24rpx;

    .item-content-row {
        display: flex;
        justify-content: space-between;
        padding: 32rpx 0;
        font-size: 28rpx;
        border-bottom: 2rpx solid rgba(240, 240, 240, 1);

        >view:nth-child(1) {
            font-weight: 400;
            color: rgba(103, 117, 133, 1);
            width: 140rpx;
        }

        >view:nth-child(2) {
            flex: 1;
            font-weight: 500;
            color: rgba(12, 16, 25, 1);
            // 超出隐藏显示省略号
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            text-align: right;
        }
    }
}
.rate-box {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
</style>